import 'package:edu/constants/app_images.dart';
import 'package:edu/constants/app_strings.dart';
import 'package:flutter/material.dart';
import 'package:smooth_page_indicator/smooth_page_indicator.dart';

class WelcomePage extends StatelessWidget {
  // 创建一个PageController对象，初始页面为0
  final _pageController = PageController(initialPage: 0);
  // 跳转按钮点击事件
  final Function skipAction;
  // 构造函数
  WelcomePage({super.key, required this.skipAction});

  @override
  Widget build(BuildContext context) {
    return Container(
      // 设置背景色
      color: Theme.of(context).scaffoldBackgroundColor,
      // 构建图片滑动
      child: SafeArea(
        child: Column(
          children: [
            Expanded(flex: 4, child: _buildPageView(context)),
            Expanded(
              flex: 1,
              child: Column(
                children: [
                  const SizedBox(height: 20),
                  _buildIndicator(context),
                  const Spacer(),
                  _buildSkipButton(context),
                  const SizedBox(height: 40),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }

  // 跳过事件
  Widget _buildSkipButton(BuildContext context) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.end,
      children: [
        MaterialButton(
          onPressed: () {
            skipAction();
          },
          child: Text(
            AppStrings.skip,
            style: Theme.of(context).textTheme.headlineSmall,
          ),
        ),
        const SizedBox(width: 20),
      ],
    );
  }

  // 构建滑动按钮效果
  Widget _buildIndicator(BuildContext context) {
    return SmoothPageIndicator(
      controller: _pageController,
      count: 3,
      effect: WormEffect(activeDotColor: Theme.of(context).colorScheme.primary),
    );
  }

  // 构建页面视图,滑动
  Widget _buildPageView(BuildContext context) {
    return PageView(
      controller: _pageController,
      // 滑动方向
      scrollDirection: Axis.horizontal,
      // 反向滑动
      reverse: false,
      // 自动滑动
      pageSnapping: true,
      // 禁用滑动, 第一张和最后一张不能滑动
      physics: const ClampingScrollPhysics(),
      // 构建图片和文字组件
      children: [
        _buildSingleImage(
          context: context,
          imagePath: AppImages.image1,
          title: AppStrings.welcomeTitle1,
          description: AppStrings.welcomeDesc1,
        ),
        _buildSingleImage(
          context: context,
          imagePath: AppImages.image2,
          title: AppStrings.welcomeTitle2,
          description: AppStrings.welcomeDesc2,
        ),
        _buildSingleImage(
          context: context,
          imagePath: AppImages.image3,
          title: AppStrings.welcomeTitle3,
          description: AppStrings.welcomeDesc3,
        ),
      ],
    );
  }

  // 构建单个图片和文字组件
  Widget _buildSingleImage({
    required BuildContext context,
    required String imagePath,
    required String title,
    required String description,
  }) {
    // 添加SingleChildScrollView组件，
    //使用 Expanded 和 SingleChildScrollView 确保内容不会溢出
    return SingleChildScrollView(
      child: Column(
        children: [
          Image.asset(imagePath, fit: BoxFit.fitWidth),
          Container(
            // 设置间隔
            margin: const EdgeInsets.only(top: 15),
            // 居中
            child: Text(
              // 标题
              title,
              textAlign: TextAlign.center,
              // 设置字体大小
              style: Theme.of(context).textTheme.headlineSmall,
            ),
          ),
          Container(
            // 设置间隔
            margin: const EdgeInsets.only(top: 15),
            padding: const EdgeInsets.symmetric(horizontal: 30),
            // 居中
            child: Text(
              // 描述
              description,
              textAlign: TextAlign.center,
              // 设置字体大小
              style: Theme.of(context).textTheme.bodyLarge,
            ),
          ),
        ],
      ),
    );
  }
}
